<%@page contentType="text/html"%>
<%@page pageEncoding="UTF-8"%>
 <div id="container1" style="min-width:400px;height:400px;margin-top: 30px;"></div>
<script>
$(function () {
    $('#container1').highcharts({
    	credits: {  
            enabled:false  
 		},title: {
            text: '招生地区性别比例'
        },
        xAxis: {
            categories: ['茶陵', '醴陵', '攸县', '株洲', '其他']
        },yAxis: {
            title: {
                text: '人数(个)'
            }
        },
        labels: {
            items: [{
                html: '男女比例',
                style: {
                    left: '100px',
                    top: '-20px',
                    color: (Highcharts.theme && Highcharts.theme.textColor) || 'black'
                }
            }]
        },
        series: [{
            type: 'column',
            name: '男',
            data: [${list[0].茶陵+0},${list[0].醴陵+0},${list[0].攸县+0},${list[0].株洲+0},${list[0].其他+0}]
        }, {
            type: 'column',
            name: '女',
            data: [${list[1].茶陵+0},${list[1].醴陵+0},${list[1].攸县+0},${list[1].株洲+0},${list[1].其他+0}]
        }, {
            type: 'spline',
            name: '总人数',
            data: [${list[0].茶陵+list[1].茶陵}, ${list[0].醴陵+list[1].醴陵}, ${list[0].攸县+list[1].攸县}, ${list[0].株洲+list[1].株洲}, ${list[0].其他+list[1].其他}],
            marker: {
                lineWidth: 2,
                lineColor: Highcharts.getOptions().colors[2],
                fillColor: 'white'
            }
        }, {
        	type: 'pie',
            name: '总人数',
            data: [{
                name: '男',
                y: ${list[0].茶陵+list[0].醴陵+list[0].攸县+list[0].株洲+list[0].其他},
                color: Highcharts.getOptions().colors[0] // Jane's color
            }, {
                name: '女',
                y: ${list[1].茶陵+list[1].醴陵+list[1].攸县+list[1].株洲+list[1].其他},
                color: Highcharts.getOptions().colors[1] // John's color
            }],
            center: [100, 30],
            size: 100,
            showInLegend: false,
            dataLabels: {
                enabled: false
            }
        }]
    });
});

</script>